
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui" 
      xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">
    <link type="text/css" rel="stylesheet" href="estilo.css" />
    <h1>Estadísticas de negocio</h1>
       
        <p:fieldset legend="Ventas por usuario">
            <p:outputLabel value="Número de ventas y cupones en tu negocio distribuidos por usuario." style="font-size: small"/>
            <p:barChart id="ventasusuarionegocio" value="#{chartB.categoryModel}" legendPosition="ne" style="width: 100%"  
                        orientation="horizontal" min="0"  shadow="true" animate="true"/>  
        </p:fieldset>            
            <br />

        <p:fieldset legend="Ventas de los últimos 6 meses">
            <p:outputLabel value="Número de ventas y cupones en tu negocio de los últimos 6 meses." style="font-size: small"/>
            <p:lineChart id="ventasmesnegocio" value="#{chartB.categoryModel2}" legendPosition="e"  
                minY="0" style="height:300px;margin-top:20px;width: 100%" animate="true"/>
        </p:fieldset>            
            <br />

        <p:fieldset legend="Ventas de Negocios">
            <p:outputLabel value="Número de ventas de cada uno de los negocios de AgrupadosSA." style="font-size: small"/>
            <p:pieChart id="ventasnegocios" value="#{chartB.pieModel}" legendPosition="w"  
                        style="width:100%;height:300px">
                <p:ajax event="itemSelect" listener="#{chartB.itemSelect}" update=":formCentro:vnDetail,:formCentro:dlgInfo" oncomplete="PF('vnDialog').show()" />
            </p:pieChart>
        </p:fieldset>            
            <br />
            
    <p:dialog header="#{chartB.VNselected.vnNegocio}" id="dlgInfo" widgetVar="vnDialog" modal="false" closeOnEscape="true" resizable="false">  
                <p:outputPanel id="vnDetail" style="text-align:center;">
                    <p:outputLabel value="Ventas realizadas: "/>
                    <p:outputLabel value="#{chartB.VNselected.vnNumVentas}"/>
                    <br />
                    <p:outputLabel value="Copunes vendidos: "/>
                    <p:outputLabel value="#{chartB.VNselected.vnNumCupones}"/>
                </p:outputPanel>  
            </p:dialog> 
    
</ui:composition>